import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import { routerRedux, Route, Link } from 'dva/router';
import moment from 'moment';
import {
    Row, Col, Card, Form, Input,
    Select, Icon, Button, Dropdown, Menu,
    InputNumber, DatePicker, Modal, message,
    Divider, Tag, Table, Pagination, Spin, Upload
    , AutoComplete
} from 'antd';
import StandardTable from '../../components/StandardTable';
import PageHeaderLayout from '../../layouts/PageHeaderLayout';
import DescriptionList from '../../components/DescriptionList';
import styles from './ChannelMaintenance.less';

import { validatemobile } from '../../utils/utils';

const { Description } = DescriptionList;
const FormItem = Form.Item;
const confirm = Modal.confirm;
const { Option } = Select;
const { MonthPicker, RangePicker } = DatePicker;
/*
  渠道经销商备案审核界面
*/
let token = sessionStorage.getItem("token");
let tableListDataSource = [];
const channelState = ["未审核", "通过", "否决"]

@connect(({ channel }) => ({
    channel,
}))
@Form.create()
export default class DealerAudit extends PureComponent {
    state = {
        modalVisible: false,
    };

    componentDidMount() {
        const { dispatch } = this.props;
        dispatch({
            type: 'channel/fetchChannel',
            payload: {
                offset: 0,
                limit: 10,
            },
        });
    }

    columns = [{
        title: '经销商编号',
        dataIndex: 'dealerNo',
        key: 'dealerNo',
    }, {
        title: '经销商名称',
        dataIndex: 'dealerName',
        key: 'dealerName',
    }, {
        title: '负责人',
        dataIndex: 'leader',
        key: 'leader',
    }, {
        title: '联系电话',
        dataIndex: 'phone',
        key: 'phone',
    }, {
        title: '状态',
        dataIndex: 'verifyState',
        key: 'verifyState',
        render(val) {
            switch (val) {
                case 0:
                    return <Tag color="red">{channelState[val]}</Tag>
                case 1:
                    return <Tag color="green">{channelState[val]}</Tag>
                case 2:
                    return <Tag color="#919191">{channelState[val]}</Tag>
            }
        },
    }, {
        title: '创建时间',
        dataIndex: 'createTime',
        key: 'createTime',
    }, {
        title: '操作',
        dataIndex: 'id',
        key: 'id',
        render: (text, record) => (
            <Fragment>

                <Link to={`/channel/channel-details?id=${record.id}&state=5`}>详情</Link>
                {record.verifyState == '0' ?
                    <Fragment>
                        <Divider type="vertical" />
                        <Link to={`/channel/channel-details?id=${record.id}&state=2`}>审核</Link>
                    </Fragment>
                    : null}
            </Fragment>
        )
    }];

    // handleStandardTableChange = (pagination, filtersArg, sorter) => {
    //     const { dispatch } = this.props;
    //     const { formValues } = this.state;

    //     const filters = Object.keys(filtersArg).reduce((obj, key) => {
    //       const newObj = { ...obj };
    //       newObj[key] = getValue(filtersArg[key]);
    //       return newObj;
    //     }, {});

    //     const params = {
    //       offset: (pagination.current - 1) * pagination.pageSize,
    //       limit: pagination.pageSize,
    //       ...formValues,
    //       ...filters,
    //     };
    //     const p = params.state.split(",")
    //     if(p.length > 1){
    //       dispatch({
    //         type: 'channel/fetchChannel',
    //         payload: {
    //           offset: 0,
    //           limit: 10,
    //         },
    //       });
    //     }else{
    //       dispatch({
    //         type: 'channel/fetchChannel',
    //         payload: params,
    //       });
    //     }
    //   }
    handleStandardTableChange = (e) => {
        this.props.dispatch({
            type: 'channel/fetchChannel',
            payload: { offset: (e.current - 1) * e.pageSize, limit: e.pageSize },
        });
    }

    render() {

        const { channel: { channelList, channelLoading, channelPage } } = this.props

        return (
            <PageHeaderLayout title="经销商审核">

                <Card bordered={false}>
                    <div className={styles.tableList}>

                        <Table
                            dataSource={channelList}
                            pagination={channelPage}
                            columns={this.columns}
                            loading={channelLoading}
                            rowKey="id"
                            onChange={this.handleStandardTableChange}
                        />
                    </div>
                </Card>
            </PageHeaderLayout>
        );
    }
}
